import React from 'react';
import {Icon, Center, Text} from 'native-base';
import {Path, G} from 'react-native-svg';

const Example = props => {
  let color='#41FD7E';
  if(props.level>4&&props.level<10) color="#417BFD"
  else if (props.level>9) color="#FDEB41"
  return (
    <Icon size="5" viewBox="0 0 1100 1000">
      <Path
        d="M252.216 0L0 312.543 552.07 1024l562.087-711.457L861.94 0H252.216z"
        fill={color}></Path>
    </Icon>
  );
};

export default props => {
  return (
    <Center>
      <Example level={props.level}/>
      <Text style={{position:'absolute',color:'white',paddingBottom:3}}  fontWeight={'bold'} fontSize={11}>{props.level}</Text>
    </Center>
  );
};
